この手順では、ChartView オブジェクトを追加して、X 軸をカスタマイズできるようにします。
ChartViewオブジェクトを追加して、X 軸と Y 軸のタイトルを設定できるようにします。ChartView オブジェクトは、データが含まれるグラフの領域(軸を含む)を表します。グラフの軸の詳細については、「軸」を参照してください。軸のタイトルは単なるテキストではなく、UIElement オブジェクトです。この例では、TextBlock 要素を使用して、X 軸と Y 軸のタイトルにテキストを割り当てます。TextBlock 要素を追加したら、その前景色を変更して中央揃えにすることによって、テキストを書式設定できます。
XAML |
コードのコピー
|
---|---|
<c1chart:C1Chart > <c1chart:C1Chart.View> <c1chart:ChartView> <c1chart:ChartView.AxisX> <c1chart:Axis> <c1chart:Axis.Title> <TextBlock Text="価格" TextAlignment="Center" Foreground="Crimson"/> </c1chart:Axis.Title> </c1chart:Axis> </c1chart:ChartView.AxisX> <c1chart:ChartView.AxisY> <c1chart:Axis> <c1chart:Axis.Title> <TextBlock Text="キッチン家電" TextAlignment="Center" Foreground="Crimson"/> </c1chart:Axis.Title> </c1chart:Axis> </c1chart:ChartView.AxisY> </c1chart:ChartView> </c1chart:C1Chart.View> </c1chart:C1Chart> |
デフォルトの AxisX.MajorUnitの単位値を 5000 から 2000 に変更します。これで、Viewオブジェクトの XAML コードは、次のようになるはずです。
XAML |
コードのコピー
|
---|---|
<c1chart:C1Chart.View> <c1chart:ChartView> <c1chart:ChartView.AxisX> <c1chart:Axis Min="0" Max="50000" MajorUnit="2000" > <c1chart:Axis.Title> <TextBlock Text="価格" TextAlignment="Center" Foreground="Crimson" /> </c1chart:Axis.Title> </c1chart:Axis> </c1chart:ChartView.AxisX> <c1chart:ChartView.AxisY> <c1chart:Axis> <c1chart:Axis.Title> <TextBlock Text="キッチン家電" TextAlignment="Center" Foreground="Crimson" /> </c1chart:Axis.Title> </c1chart:Axis> </c1chart:ChartView.AxisY> </c1chart:ChartView> </c1chart:C1Chart.View> |
ChartView.AxisXオブジェクトの内<c1chart:Axis></c1chart:Axis>で、AnnoFormatを設定して x 軸の数値の x 値を通貨に変更し、AnnoAngleプロパティを設定して X 軸の注釈を反時計回りに 60° 回転させます。
<c1chart:Axis AnnoFormat="c" AnnoAngle="60" />
ChartView.AxisYオブジェクトの内<c1chart:Axis></c1chart:Axis>で、ReversedプロパティをTrueに設定して、Y 軸の方向を逆転させます。次の「手順 4:グラフの外観の調整」では、XAML を使用してグラフの外観をカスタマイズする方法を学びます。
コンストラクタの Window1 クラスで次のコードを追加して、グラフの軸を書式設定します。
次の「手順 4:グラフの外観の調整」では、プログラムでグラフの外観をカスタマイズする方法を学びます。
軸の注釈の新しい書式がグラフに適用されます。
次の手順では、Theme プロパティのオプションの1つを使用して、グラフの外観をカスタマイズします。